import { ToolBox } from '../../toolbox/ToolBox';
import KeyEvent from '../android/KeyEvent';
import SvgImage from '../../ui/SvgImage';
import { KeyCodeControlMessage } from '../../controlMessage/KeyCodeControlMessage';
import { ToolBoxButton } from '../../toolbox/ToolBoxButton';
import { ToolBoxElement } from '../../toolbox/ToolBoxElement';
import { ToolBoxCheckbox } from '../../toolbox/ToolBoxCheckbox';
import { StreamClientScrcpy } from '../client/StreamClientScrcpy';
import { BasePlayer } from '../../player/BasePlayer';
import { BroadcastService } from '../../interactionHandler/BroadcastService';
import request from '@/utils'
import store from '../../../store'
const BUTTONS = [
	{
		title: '电源',
		code: KeyEvent.KEYCODE_POWER,
		icon: SvgImage.Icon.POWER,
	},
	{
		title: '声音增大',
		code: KeyEvent.KEYCODE_VOLUME_UP,
		icon: SvgImage.Icon.VOLUME_UP,
	},
	{
		title: '声音减小',
		code: KeyEvent.KEYCODE_VOLUME_DOWN,
		icon: SvgImage.Icon.VOLUME_DOWN,
	},
	{
		title: '回退',
		code: KeyEvent.KEYCODE_BACK,
		icon: SvgImage.Icon.BACK,
	},
	{
		title: '主界面',
		code: KeyEvent.KEYCODE_HOME,
		icon: SvgImage.Icon.HOME,
	},
	{
		title: '浏览页',
		code: KeyEvent.KEYCODE_APP_SWITCH,
		icon: SvgImage.Icon.OVERVIEW,
	},
];

export class GoogToolBox extends ToolBox {
	protected constructor(list : ToolBoxElement<any>[]) {
		super(list);
	}

	public static createToolBox(
		udid : string,
		player : BasePlayer,
		client : StreamClientScrcpy,
		moreBox ?: HTMLElement,
	) : GoogToolBox {
		const playerName = player.getName();
		const list = BUTTONS.slice();
		const handler = <K extends keyof HTMLElementEventMap, T extends HTMLElement>(
			type : K,
			element : ToolBoxElement<T>,
		) => {
			if (!element.optional?.code) {
				return;
			}
			const { code } = element.optional;
			const action = type === 'mousedown' ? KeyEvent.ACTION_DOWN : KeyEvent.ACTION_UP;
			const event = new KeyCodeControlMessage(action, code, 0, 0);
			client.sendMessage(event);
			//对其他云手机发送按钮对应的操作信息广播
			BroadcastService.getInstance().broadcastToAll(
				client, // 发送源是当前客户端
				event,
				true // 排除自身
			);
		};
		const elements : ToolBoxElement<any>[] = list.map((item) => {
			const button = new ToolBoxButton(item.title, item.icon, {
				code: item.code,
			});
			button.addEventListener('mousedown', handler);
			button.addEventListener('mouseup', handler);
			return button;
		});
		if (player.supportsScreenshot) {
			const screenshot = new ToolBoxButton('摄像头', SvgImage.Icon.CAMERA);
			screenshot.addEventListener('click', () => {
				player.createScreenshot(client.getDeviceName());
			});
			elements.push(screenshot);
		}

		const keyboard = new ToolBoxCheckbox(
			'本地键盘',
			SvgImage.Icon.KEYBOARD,
			`capture_keyboard_${udid}_${playerName}`,
		);
		keyboard.addEventListener('click', (_, el) => {
			const element = el.getElement();
			client.setHandleKeyboardEvents(element.checked);
			//把云手机本地键盘还是云手机自带键盘开关群体设置
			if (client.is_master_cloud && store.state.is_sync) {
				BroadcastService.getInstance().change_keyboard_ToAll(
					client, // 发送源是当前客户端
					element.checked,
					true // 排除自身
				);
			}
		});
		elements.push(keyboard);
		if (moreBox) {
			const displayId = player.getVideoSettings().displayId;
			const id = `show_more_${udid}_${playerName}_${displayId}`;
			const more = new ToolBoxCheckbox('More', SvgImage.Icon.MORE, id);
			more.addEventListener('click', (_, el) => {
				const element = el.getElement();
				moreBox.style.display = element.checked ? 'block' : 'none';
			});
			elements.unshift(more);
		}
		return new GoogToolBox(elements);
	}
}